body {
  background-image: url("https://s3.amazonaws.com/shecodesio-production/uploads/files/000/163/302/original/Download_25__Best_Rose_Gold_iPhone_Wallpaper_Ideas_%28Free_4k_HD_Download%29.jpeg?1744843196");
  background-color: rgb(255, 255, 255);
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  height: fit-content;
  color: rgb(150, 125, 111);
  font-family: "Eagle Lake", serif;
}

.container {
  border-radius: 4px;
  background-color: rgb(255, 213, 189);
  background-size: contain;
  margin: 50px auto;
  padding: 5px;
  width: 35%;
  height: fit-content;
  box-shadow: rgba(249, 195, 147, 0.4) 5px 5px,
    rgba(249, 195, 147, 0.3) 10px 10px, rgba(249, 195, 147, 0.2) 15px 15px,
    rgba(249, 195, 147, 0.1) 20px 20px, rgba(249, 195, 147, 0.05) 25px 25px;
}

.container .header {
  font-size: 55px;
  letter-spacing: 1.5px;
  line-height: 1.5;
  text-shadow: 6px 4px 6px rgb(255, 232, 218);
  text-align: center;
}

.container .header .tiny {
  position: relative;
  bottom: -6px;
  border: 6px solid rgb(150, 125, 111);
  border-radius: 180px;
  width: 8%;
  height: 6vh;
  mix-blend-mode: darken;
}

.container .location-select {
  display: block;
  background: rgb(255, 226, 190);
  border: 2px solid rgb(251, 213, 100);
  border-radius: 4px;
  width: 100%;
  font-family: "Eagle Lake", serif;
  padding: 5px;
  color: rgb(131, 109, 97);
}

.location-select .choice {
  color: rgb(127, 127, 127);
  font-family: "Eagle Lake", serif;
}

.container .city {
  display: flexbox;
  margin: 10px 0;
  justify-content: space-between;
  padding: 25px 0;
  border-bottom: 6px double rgb(251, 213, 100);
  text-shadow: 0 0 15px rgb(251, 219, 174);
}

.city:last-child {
  border: none;
}

.container .name {
  display: flex;
  margin-bottom: 0;
  text-shadow: 6px 4px 6px rgb(255, 232, 218);
}

.container.city .date {
  position: relative;
  opacity: 0.7;
  text-shadow: 6px 4px 6px rgb(255, 232, 218);
}

.container .city .time {
  position: relative;
  bottom: 70px;
  font-size: 40px;
  font-weight: bold;
  text-shadow: 6px 4px 6px rgb(255, 232, 218);
  text-align: right;
}

.time small {
  font-size: 14px;
  vertical-align: middle;
  line-height: 33px;
}

.fineprint {
  margin-top: 10px;
  font-size: 10px;
  font-weight: 600;
  text-shadow: 0 0 15px rgb(251, 219, 174);
  text-align: center;
}

a {
  border-radius: 4px;
  color: rgb(150, 125, 111);
  text-decoration: none;
  background: none;
  border: 2px solid rgb(251, 219, 174);
  transition: all 150ms ease-in-out;
}

a:hover {
  background-color: rgb(255, 213, 189);
  cursor: pointer;
}

.eagle-lake-regular {
  font-family: "Eagle Lake", serif;
  font-weight: 400;
  font-style: normal;
}
